<template>
  <div>
    <el-row>
      <el-col>
        <div id="sanchi" :style="{width: '100%', height: '400px'}"></div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        msg: ''
      }
    },
    mounted() {
      this.drawLine();
    },
    methods: {
      drawLine() {
        // 基于准备好的dom，初始化echarts实例
        let sanchi = this.$echarts.init(document.getElementById('sanchi'));
        // 绘制图表
        sanchi.setOption(
          {
            series: {
              type: 'sankey',
              layout:'none',
              data: [{
                name: 'a'
              }, {
                name: 'b'
              }, {
                name: 'a1'
              }, {
                name: 'a2'
              }, {
                name: 'b1'
              }, {
                name: 'c'
              }],
              links: [{
                source: 'a',
                target: 'a1',
                value: 5
              }, {
                source: 'a',
                target: 'a2',
                value: 3
              }, {
                source: 'b',
                target: 'b1',
                value: 8
              }, {
                source: 'a',
                target: 'b1',
                value: 3
              }, {
                source: 'b1',
                target: 'a1',
                value: 1
              }, {
                source: 'b1',
                target: 'c',
                value: 2
              }]
            }
          }
        );
      }
    }
  }
</script>

<style scoped>

</style>
